<template>
	<view>
		<view class="list">
			<view class="item u-flex" v-for="item in list" :key="item.id">
				<image class="avatar" src="/static/images/dev.png"></image>
				<view class="info u-flex-1 u-flex">
					<view class="u-flex-1 info-box">
						<view class="title u-line-1">文一塘溪津门文一塘溪津门</view>
						<view class="address u-line-1">包河大道与杭州路交口...包河大道与杭州路交口...包河大道与杭州路交口...</view>
					</view>
					
					<view class="icon">
						<u-icon name="arrow-right" color="#666" size="30"></u-icon>
					</view>
				</view>
			</view>
		</view>
		
		<u-empty v-if="isEmpty" text="暂无相关信息" margin-top="200"></u-empty>
		<view style="padding-bottom: 10rpx;" v-if="p > 1">
			<u-loadmore :status="status" />
		</view>
		<view class="safe-area-inset-bottom"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				p:1,
				list:[],
				status:'loading',
				isEmpty:!1
			}
		},
		methods: {
			getList(){
				this.status = 'loading'
				this.$u.post('/api/user/appointmentLookList',{
					p:this.p
				}).then(res=>{
					this.list = this.p == 1 ? res : this.list.concat(res)
					this.status = res.length  === 20 ? 'loadmore' : 'nomore'
					this.isEmpty = (this.p === 1 && res.length === 0) ? !0 : !1
					uni.stopPullDownRefresh()
				})
			},
			jumps(item){
				this.jump(`/pages/house/${this.$app.TYPE_MAP[item.build_type - 1].key}/detail?id=${item.house_id}`)
			}
		},
		onLoad() {
			this.getList()
		},
		onReachBottom() {
			if(this.status == 'loadmore'){
				this.p ++
				this.getList()
			}
		}
	}
</script>

<style lang="scss">
	.list{
		.item{
			padding-top: 26rpx;padding-bottom: 4rpx;
			.avatar{width: 110rpx;height: 110rpx;border-radius: 50%;flex-shrink: 0;margin: 0 30rpx 0 40rpx;}
			.info{
				border-bottom: 1rpx solid #ddd;overflow: hidden;min-height: 110rpx;
				.info-box{overflow: hidden;}
				.title{font-weight: bold;font-size: 32rpx;margin-top: 6rpx;}
				.address{font-size: 26rpx;color: #666;padding-top: 10rpx;}
				.icon{padding: 0 20rpx 0 0rpx;}
			}
		}
	}
</style>
